<template>
  <tr>
    <th>
      <input
        type="checkbox"
        :checked="item.checked"
        @input="$emit('checked-event', index)"
      />
      <span></span>
    </th>
    <th>{{ item.name }}</th>
    <th>{{ item.price }}</th>
    <th>
      <button
        @click="$emit('change-num', item.num - 1, index)"
        :disabled="item.num === 0"
      >
        -
      </button>
      {{ item.num }}
      <button @click="$emit('change-num', item.num + 1, index)">+</button>
    </th>
    <th>{{ total }}</th>
    <th><button @click="$emit('del',index)">删除</button></th>
  </tr>
</template>

<script>
export default {
  components: {},
  props: {
    item: {
      type: Object,
    },
    index: Number,
  },
  data() {
    return {};
  },
  computed: {
    total() {
      return this.item.price * this.item.num;
    },
  },
  watch: {},
  created() {},
  methods: {},
};
</script>

<style scoped></style>
